import React, { useMemo } from 'react';
import './DepartDate.css';
import dayjs from 'dayjs';
import { h0 } from '../common/fp';
import PropTypes from 'prop-types';

/**
 *  当前组件的数据 并不全是来自props 所以不要用memo来优化
 * @param {*} props
 */
export default function DepartDate(props) {
  const { time, onClick } = props;
  // 将日期时间戳 仅精确到天
  const h00fDepart = h0(time);
  const departDate = new Date(h00fDepart);

  //将时间格式化文本
  const departDateString = useMemo(() => {
    return dayjs(h00fDepart).format('YYYY-MM-DD');
  }, [h00fDepart]);
  //判断是否为 今天
  const isToday = h00fDepart === h0();

  //星期
  const weekString =
    '周' +
    ['日', '一', '二', '三', '四', '五', '六'][departDate.getDay()] +
    (isToday ? '(今天)' : '');
  return (
    <div className="depart-date" onClick={onClick}>
      <input type="hidden" name="date" value={departDateString} />
      {departDateString}
      <span className="depart-week">{weekString}</span>
    </div>
  );
}
DepartDate.propTypes = {
  time: PropTypes.number.isRequired,
  onClick: PropTypes.func.isRequired,
};
